﻿<mockups:WindowsPhoneChrome 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:mockups="clr-namespace:Microsoft.Expression.Prototyping.WindowsPhone.Mockups;assembly=WindowsPhone.Mockups"
    xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity"
    xmlns:pi="http://schemas.microsoft.com/prototyping/2010/interactivity"
    xmlns:ei="http://schemas.microsoft.com/expression/2010/interactions"
    xmlns:SampleData="clr-namespace:Expression.Blend.SampleData.SampleSongs" xmlns:pc="http://schemas.microsoft.com/prototyping/2010/controls"
    xmlns:System="clr-namespace:System;assembly=mscorlib"
    xmlns:local="clr-namespace:ToyundaPhonePrototypeScreens"
    mc:Ignorable="d"
    x:Class="ToyundaPhonePrototypeScreens.Screen_1"
    x:Name="PhoneChrome">
	<mockups:WindowsPhoneChrome.Resources>
		<SampleData:SampleSongs x:Key="SampleSongs" d:IsDataSource="True"/>
	</mockups:WindowsPhoneChrome.Resources>
    <i:Interaction.Triggers>
    	<i:EventTrigger EventName="OrientationChanged">
    		<i:Interaction.Behaviors>
    			<ei:ConditionBehavior>
    				<ei:ConditionalExpression>
    					<ei:ComparisonCondition LeftOperand="{Binding PageOrientation, ElementName=PhoneChrome}"
    						RightOperand="Landscape" />
    				</ei:ConditionalExpression>
    			</ei:ConditionBehavior>
    		</i:Interaction.Behaviors>
    		<mockups:GoToStateAction StateName="Landscape"
    			TargetObject="{Binding ElementName=LayoutRoot}"
    			TargetName="LayoutRoot" />
    	</i:EventTrigger>
    	<i:EventTrigger EventName="OrientationChanged">
    		<i:Interaction.Behaviors>
    			<ei:ConditionBehavior>
    				<ei:ConditionalExpression>
    					<ei:ComparisonCondition LeftOperand="{Binding PageOrientation, ElementName=PhoneChrome}"
    						RightOperand="Portrait" />
    				</ei:ConditionalExpression>
    			</ei:ConditionBehavior>
    		</i:Interaction.Behaviors>
    		<mockups:GoToStateAction StateName="Portrait"
    			TargetObject="{Binding ElementName=LayoutRoot}"
    			TargetName="LayoutRoot" />
    	</i:EventTrigger>
    </i:Interaction.Triggers>

    <mockups:WindowsPhoneChrome.BackButton>
        <Button Style="{StaticResource Chrome-Button}">
            <i:Interaction.Triggers>
            	<i:EventTrigger EventName="Click">
            		<pi:NavigateBackAction />
            	</i:EventTrigger>
            </i:Interaction.Triggers>
            <Image Source="/AppBarIcons/back.png" />
        </Button>
    </mockups:WindowsPhoneChrome.BackButton>

    <mockups:WindowsPhoneChrome.HomeButton>
        <Button Style="{StaticResource Chrome-Button}">
            <i:Interaction.Triggers>
            	<i:EventTrigger EventName="Click">
            		<pi:NavigateToScreenAction TargetScreen="ToyundaPhonePrototypeScreens.Home" />
            	</i:EventTrigger>
            </i:Interaction.Triggers>
            <Image Source="/AppBarIcons/home.png" />
        </Button>
    </mockups:WindowsPhoneChrome.HomeButton>

    <mockups:WindowsPhoneChrome.SearchButton>
        <Button Style="{StaticResource Chrome-Button}">
            <i:Interaction.Triggers>
            	<i:EventTrigger EventName="Click">
            		<pi:NavigateToScreenAction TargetScreen="ToyundaPhonePrototypeScreens.Search" />
            	</i:EventTrigger>
            </i:Interaction.Triggers>
            <Image Source="/AppBarIcons/search.png" />
        </Button>
    </mockups:WindowsPhoneChrome.SearchButton>

    <Grid x:Name="LayoutRoot" DataContext="{Binding Source={StaticResource SampleSongs}}">
    	<Grid.RowDefinitions>
    		<RowDefinition Height="Auto"/>
    		<RowDefinition/>
    		<RowDefinition Height="Auto"/>
    	</Grid.RowDefinitions>
		<VisualStateManager.CustomVisualStateManager>
			<ei:ExtendedVisualStateManager />
		</VisualStateManager.CustomVisualStateManager>
		<VisualStateManager.VisualStateGroups>
			<VisualStateGroup x:Name="CommonStates"
				ei:ExtendedVisualStateManager.UseFluidLayout="True">
				<VisualState x:Name="Portrait" />
				<VisualState x:Name="Landscape">
					<Storyboard>
						<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(WindowsPhoneChrome.PageOrientation)"
							Storyboard.TargetName="PhoneChrome">
							<DiscreteObjectKeyFrame KeyTime="0">
								<DiscreteObjectKeyFrame.Value>
									<mockups:PageOrientation>Landscape</mockups:PageOrientation>
								</DiscreteObjectKeyFrame.Value>
							</DiscreteObjectKeyFrame>
						</ObjectAnimationUsingKeyFrames>
					</Storyboard>
				</VisualState>
			</VisualStateGroup>
		</VisualStateManager.VisualStateGroups>
    	<local:SongSearchComponent d:IsPrototypingComposition="True"/>
    	<local:MainSongListComponent Margin="12,0,12,0" d:IsPrototypingComposition="True" Grid.Row="1"/>
    	<mockups:ApplicationBarMockup Grid.Row="2">
    		<mockups:ApplicationBarMockup.IconButtonsContent>
    			<StackPanel HorizontalAlignment="Center" Orientation="Horizontal">
    				<mockups:ApplicationBarIconButton Content="Lists">
    					<i:Interaction.Triggers>
    						<i:EventTrigger EventName="Click">
    							<pi:NavigateToScreenAction TargetScreen="ToyundaPhonePrototypeScreens.Playlists"/>
    						</i:EventTrigger>
    					</i:Interaction.Triggers>
    				</mockups:ApplicationBarIconButton>
    				<mockups:ApplicationBarIconButton Content="Favs" ImageSource="/AppBarIcons/favs.png">
    					<i:Interaction.Triggers>
    						<i:EventTrigger EventName="Click">
    							<pi:NavigateToScreenAction TargetScreen="ToyundaPhonePrototypeScreens.Favorites"/>
    						</i:EventTrigger>
    					</i:Interaction.Triggers>
    				</mockups:ApplicationBarIconButton>
    				<mockups:ApplicationBarIconButton Content="Refresh" d:LayoutOverrides="Height" ImageSource="/AppBarIcons/refresh.png"/>
    			</StackPanel>
    		</mockups:ApplicationBarMockup.IconButtonsContent>
    		<mockups:ApplicationBarMockup.MenuItemsContent>
    			<StackPanel>
    				<TextBlock Margin="4" Style="{StaticResource PhoneTextTitle3Style-Sketch}" Text="Select current list"/>
    			</StackPanel>
    		</mockups:ApplicationBarMockup.MenuItemsContent>
    	</mockups:ApplicationBarMockup>
	</Grid>
</mockups:WindowsPhoneChrome>